<!DOCTYPE html>
<html>
<head>
    <title>Geometry Interfaces: DOMQuad interface tests</title>
    <link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com" />
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#DOMQuad">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-domquad">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-p1">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-p2">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-p3">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-p4">
    <link rel="help" href="http://www.w3.org/TR/geometry-1/#dom-domquad-bounds">
    <script src="/resources/testharness.js"></script>
    <script src="/resources/testharnessreport.js"></script>
</head>
<body>
    <p>Test DOMQuad interface</p>
    <div id="log"></div>
    <script>
        initial = {
            p1: { x: 0, y: 0, z: 0, w: 1 },
            p2: { x: 0, y: 0, z: 0, w: 1 },
            p3: { x: 0, y: 0, z: 0, w: 1 },
            p4: { x: 0, y: 0, z: 0, w: 1 },
            bounds: { x: 0, y: 0, width: 0, height: 0 }
        };

        test(function() {
            checkDOMQuad(new DOMQuad(), initial);
        },'testConstructor0');
        test(function() {
            assert_throws(new TypeError(), function() { new DOMQuad(1); });
        },'testConstructor1');
        test(function() {
            assert_throws(new TypeError(), function() { new DOMQuad(1, 2); });
        },'testConstructor2');
        test(function() {
            assert_throws(new TypeError(), function() { new DOMQuad(1, 2, 3); });
        },'testConstructor3');
        test(function() {
            assert_throws(new TypeError(), function() { new DOMQuad(1, 2, 3, 4); });
        },'testConstructor4');
        test(function() {
            checkDOMQuad(new DOMQuad(new DOMRect(10, 20, 100, 200)),
                {   p1: { x: 10, y: 20, z: 0, w: 1 },
                    p2: { x: 110, y: 20, z: 0, w: 1 },
                    p3: { x: 110, y: 220, z: 0, w: 1 },
                    p4: { x: 10, y: 220, z: 0, w: 1 },
                    bounds: { x: 10, y: 20, width: 100, height: 200 } });
        },'testConstructor5');
        test(function() {
            checkDOMQuad(new DOMQuad(new DOMRect(10, 20, -100, -200)),
                {   p1: { x: 10, y: 20, z: 0, w: 1 },
                    p2: { x: -90, y: 20, z: 0, w: 1 },
                    p3: { x: -90, y: -180, z: 0, w: 1 },
                    p4: { x: 10, y: -180, z: 0, w: 1 },
                    bounds: { x: -90, y: -180, width: 100, height: 200 } });
        },'testConstructor6');
        test(function() {
            checkDOMQuad(new DOMQuad(new DOMRect(-Infinity, -Infinity, Infinity, Infinity)),
                {   p1: { x: -Infinity, y: -Infinity, z: 0, w: 1 },
                    p2: { x: NaN, y: -Infinity, z: 0, w: 1 },
                    p3: { x: NaN, y: NaN, z: 0, w: 1 },
                    p4: { x: -Infinity, y: NaN, z: 0, w: 1 },
                    bounds: { x: -Infinity, y: -Infinity, width: NaN, height: NaN } });
        },'testConstructor7');
        test(function() {
            checkDOMQuad(new DOMQuad(new DOMRect()), initial);
        },'testConstructor8');
        test(function() {
            checkDOMQuad(new DOMQuad({}), initial);
        },'testConstructor9');
        test(function() {
            checkDOMQuad(new DOMQuad({}, {}), initial);
        },'testConstructor10');
        test(function() {
            checkDOMQuad(new DOMQuad({}, {}, {}), initial);
        },'testConstructor11');
        test(function() {
            checkDOMQuad(new DOMQuad({}, {}, {}, {}), initial);
        },'testConstructor12');
        test(function() {
            checkDOMQuad(new DOMQuad(null, undefined, {}, {}), initial);
        },'testConstructor13');
        test(function() {
            checkDOMQuad(new DOMQuad({}, {}, {}, {}, NaN), initial);
        },'testConstructor14');
        test(function() {
            assert_throws(new TypeError(), function() { new DOMQuad({}, {}, {}, NaN); });
        },'testConstructor15');
        test(function() {
            checkDOMQuad(new DOMQuad({ y: 10 }, { x: 20 }, { z: 30 }, { x: 20, y: 10, z: 20, w: 10 }),
                {   p1: { x: 0, y: 10, z: 0, w: 1 },
                    p2: { x: 20, y: 0, z: 0, w: 1 },
                    p3: { x: 0, y: 0, z: 30, w: 1 },
                    p4: { x: 20, y: 10, z: 20, w: 10 },
                    bounds: { x: 0, y: 0, width: 20, height: 10 } });
        },'testConstructor16');
        test(function() {
            // p1 to p4 are readonly attributes.
            var q = new DOMQuad({}, {}, {}, {});
            q.p1 = new DOMPoint(2, 2);
            q.p2 = new DOMPoint(2, 2);
            q.p3 = new DOMPoint(2, 2);
            q.p4 = new DOMPoint(2, 2);
            checkDOMQuad(q, initial);
        }, 'p1Top4Attributes0');
        test(function() {
            // p1 to p4 return the same DOMPoint object which can be modified.
            var q = new DOMQuad({}, {}, {}, {});
            q.p1.x = 2;
            q.p2.x = 2;
            q.p3.x = 2;
            q.p4.x = 2;
            checkDOMQuad(q,
                {   p1: { x: 2, y: 0, z: 0, w: 1 },
                    p2: { x: 2, y: 0, z: 0, w: 1 },
                    p3: { x: 2, y: 0, z: 0, w: 1 },
                    p4: { x: 2, y: 0, z: 0, w: 1 },
                    bounds: { x: 2, y: 0, width: 0, height: 0 } });
        }, 'p1Top4Attributes1');
        test(function() {
            var q = new DOMQuad({}, {}, {}, {});
            q.bounds = new DOMRect(10, 10, 100, 100);
            checkDOMQuad(q, initial);
        }, 'boundsAttribute0');
        test(function() {
            var q = new DOMQuad({}, {}, {}, {});
            q.bounds.x = 10;
            q.bounds.y = 10;
            q.bounds.width = 100;
            q.bounds.height = 100;
            checkDOMQuad(q, initial);
        }, 'boundsAttribute1');

        function checkDOMQuad(q, exp) {
            assert_equals(q.p1.x, exp.p1.x, "Expected value for p1.x is " + exp.p1.x);
            assert_equals(q.p1.y, exp.p1.y, "Expected value for p1.y is " + exp.p1.y);
            assert_equals(q.p1.z, exp.p1.z, "Expected value for p1.z is " + exp.p1.z);
            assert_equals(q.p1.w, exp.p1.w, "Expected value for p1.w is " + exp.p1.w);
            assert_equals(q.p2.x, exp.p2.x, "Expected value for p2.x is " + exp.p2.x);
            assert_equals(q.p2.y, exp.p2.y, "Expected value for p2.y is " + exp.p2.y);
            assert_equals(q.p2.z, exp.p2.z, "Expected value for p2.z is " + exp.p2.z);
            assert_equals(q.p2.w, exp.p2.w, "Expected value for p2.w is " + exp.p2.w);
            assert_equals(q.p3.x, exp.p3.x, "Expected value for p3.x is " + exp.p3.x);
            assert_equals(q.p3.y, exp.p3.y, "Expected value for p3.y is " + exp.p3.y);
            assert_equals(q.p3.z, exp.p3.z, "Expected value for p3.z is " + exp.p3.z);
            assert_equals(q.p3.w, exp.p3.w, "Expected value for p3.w is " + exp.p3.w);
            assert_equals(q.p4.x, exp.p4.x, "Expected value for p4.x is " + exp.p4.x);
            assert_equals(q.p4.y, exp.p4.y, "Expected value for p4.y is " + exp.p4.y);
            assert_equals(q.p4.z, exp.p4.z, "Expected value for p4.z is " + exp.p4.z);
            assert_equals(q.p4.w, exp.p4.w, "Expected value for p4.w is " + exp.p4.w);
            assert_equals(q.bounds.x, exp.bounds.x, "Expected value for bounds.x is " + exp.bounds.x);
            assert_equals(q.bounds.y, exp.bounds.y, "Expected value for bounds.y is " + exp.bounds.y);
            assert_equals(q.bounds.width, exp.bounds.width, "Expected value for bounds.width is " + exp.bounds.width);
            assert_equals(q.bounds.height, exp.bounds.height, "Expected value for bounds.height is " + exp.bounds.height);
        }
    </script>
</body>
</html>
